<template>
  <div class="container">
    <div class="detailCard">
      <div class="card">
        <div class="left">配送品类</div>
        <div class="right">{{appData.category?appData.category.name:""}}</div>
      </div>
      <div class="card">
        <div class="left">配送客户</div>
        <div class="right">{{appData.createUser?appData.createUser.name:"暂无记录"}}</div>
      </div>
      <div class="card">
        <div class="left">配送数量</div>
        <div class="right">{{appData.quantity||0}}</div>
      </div>
      <div class="card">
        <div class="left">配送时间</div>
        <div class="right">{{appData.deliveryDate||"暂无记录"}}</div>
      </div>
      <div class="card">
        <div class="left">是否加急</div>
        <div class="right">{{appData.urgentStr}}</div>
      </div>
      <div class="card">
        <div class="left">配送状态</div>
        <div class="right">{{appData.status||"暂无记录"}}</div>
      </div>
      <div class="card">
        <div class="left">配送金额</div>
        <div class="right">{{appData.cost||0}}</div>
      </div>
      <div class="card">
        <div class="left">配送备注</div>
        <div class="right">{{appData.remark||"暂无记录"}}</div>
      </div>
    </div>
    <div class="buttonArea">
      <div class="allocation back" @click="back">返回</div>
    </div>
  </div>
</template>

<script>
import { formatTime } from "@/utils/index";
import card from "@/components/card";
import { getMsgDetail, distribute } from "@/http";
import store from "@/utils/factory.js";

export default {
  components: {
    card
  },

  data() {
    return {
      appData: {},
      assign: false,
      columns: [],
      userId: "",
      userName: "",
      showDialog: false
    };
  },
  methods: {
    getMsgDetail() {
      let self = this;
      getMsgDetail({ id: store.get("msgId") }).then(res => {
        this.appData = res.data;
        if (this.appData.cost == -1) {
          this.appData.cost = "时价";
        }
        if (this.appData.urgent) {
          this.appData.urgentStr = "是";
        } else {
          this.appData.urgentStr = "否";
        }
      });
    },
    tel: function(phone) {
      mpvue.makePhoneCall({
        phoneNumber: phone
      });
    },
    back() {
      mpvue.navigateBack({
        delta: 1
      });
    }
  },
  onShow() {
    this.getMsgDetail();
  },
  mounted() {},
  created() {}
};
</script>

<style>
.card {
  display: flex;
  font-size: 28rpx;
  background: #fff;
  position: relative;
  border-bottom: 1px solid #eeeeee;
  align-items: center;
}
.left {
  flex: 1;
}
.right {
  color: #a4a4a4;
}

.back {
  color: #222222 !important;
  background: #ffc300;
}

.deleteButton {
  flex: 1;
  text-align: center;
  background: #ee0a24;
  line-height: 50px;
}

.allocation {
  color: #222222 !important;
  background: #ffc300;
  text-align: center;
  line-height: 100rpx;
  width: 320px;
  border-radius: 80rpx;
}

.buttonArea {
  display: flex;
  color: #fff;
  border-radius: 40rpx;
  justify-content: center;
  position: fixed;
  bottom: 80rpx;
  left: 0;
  right: 0;
}
</style>
